<template>
  <a-drawer
    :title="formInfo.id == undefined ? '新增' : '修改'"
    :maskClosable="false"
    width="1000"
    placement="right"
    :closable="true"
    @close="handleCancel"
    :destroyOnClose="true"
    :visible="visible"
  >
    <a-spin :spinning="confirmLoading">
      <a-form-model
        ref="ruleForm"
        :model="formInfo"
        :label-col="$global.labelCol"
        :wrapper-col="$global.wrapperCol"
      >
        <a-row>
          <a-col :span="12">
            <a-form-model-item
              label="设备名称"
              prop="equipmentName"
              :rules="$valid.required"
              :maxLength="50"
            >
              <a-input
                v-model="formInfo.equipmentName"
                placeholder="请输入设备名称"
              >
                <a-tooltip
                  slot="suffix"
                  title="请准确填写设备铭牌上公式的产品名称"
                >
                  <a-icon
                    type="info-circle"
                    style="color: rgba(0, 0, 0, 0.45)"
                  />
                </a-tooltip>
              </a-input>
            </a-form-model-item>
          </a-col>
          <a-col :span="12">
            <a-form-model-item label="通用名称" prop="genericName">
              <a-input
                v-model="formInfo.genericName"
                placeholder="请输入通用名称"
              />
            </a-form-model-item>
          </a-col>
        </a-row>
        <a-row>
          <a-col :span="12">
            <a-form-model-item label="品牌" prop="brand">
              <a-input v-model="formInfo.brand" placeholder="请输入品牌" />
            </a-form-model-item>
          </a-col>
          <a-col :span="12">
            <a-form-model-item label="型号" prop="model">
              <a-input v-model="formInfo.model" placeholder="请输入型号" />
            </a-form-model-item>
          </a-col>
        </a-row>

        <a-row>
          <a-col :span="12">
            <a-form-model-item label="生产厂商" prop="manufacturer">
              <a-input
                v-model="formInfo.manufacturer"
                placeholder="请输入生产厂商"
              />
            </a-form-model-item>
          </a-col>
          <a-col :span="12">
            <a-form-model-item label="使用寿命/有效期" prop="serviceLife">
              <a-input
                v-model="formInfo.serviceLife"
                placeholder="请输入使用寿命/有效期(年)"
              />
            </a-form-model-item>
          </a-col>
        </a-row>
        <a-row>
          <a-col :span="12">
            <a-form-model-item label="国别" prop="differentCountrie">
              <a-select
                :size="'default'"
                style="min-width: 100px"
                :showArrow="true"
                v-model="formInfo.differentCountrie"
                placeholder="请选择国别"
              >
                <a-select-option
                  v-for="item in this.$sysDictOptions('differentCountrie')"
                  :key="item.k"
                  :value="item.k"
                >
                  {{ item.v }}
                </a-select-option>
              </a-select>
            </a-form-model-item>
          </a-col>
          <a-col :span="12">
            <a-form-model-item label="是否国产" prop="isDomesticallyProduced">
              <a-radio-group
                style="line-height: 40px"
                v-model="formInfo.isDomesticallyProduced"
              >
                <a-radio key="1" value="1" class="radio-item">是</a-radio>
                <a-radio key="0" value="0" class="radio-item">否</a-radio>
              </a-radio-group>
            </a-form-model-item>
          </a-col>
        </a-row>
        <a-row>
          <a-col :span="12">
            <a-form-model-item
              label="产品外观图片"
              prop="productAppearanceImage"
            >
              <w-image-upload
                class="avatar-uploader"
                text="上传"
                :multipleFlag="false"
                :file-max-size="1"
                v-model="formInfo.productAppearanceImage"
                bizPath="companyPic"
              ></w-image-upload>
            </a-form-model-item>
          </a-col>
        </a-row>
        <a-divider orientation="left">资质证照</a-divider>
        <a-row>
          <a-col :span="12">
            <a-form-model-item
              label="是否医疗器械"
              prop="isMedicalDevice"
              :rules="$valid.required"
              :maxLength="50"
            >
              <a-switch
                style="line-height: 16px"
                checked-children="是"
                un-checked-children="否"
                v-model="formInfo.isMedicalDevice"
              >
              </a-switch>
            </a-form-model-item>
          </a-col>
          <a-col :span="12">
            <span style="font-size: 12px; color: #cbc5c4"
              >若为医疗器械，则需填写医疗器械注册证相关信息信息</span
            >
          </a-col>
        </a-row>
        <a-row v-if="formInfo.isMedicalDevice">
          <a-col :span="12">
            <a-form-model-item
              label="医疗器械注册证号"
              prop="medicalDeviceRegistrationNumber"
            >
              <a-input
                v-model="formInfo.medicalDeviceRegistrationNumber"
                placeholder="请输入医疗器械注册证号"
              />
            </a-form-model-item>
          </a-col>
          <a-col :span="12">
            <a-form-model-item
              label="医疗器械注册证"
              prop="medicalDeviceRegistrationFile"
            >
              <w-file-upload
                class="avatar-uploader"
                text="上传"
                :pdfOnly="true"
                :multipleFlag="true"
                v-model="formInfo.medicalDeviceRegistrationFile"
                bizPath="annexUrl"
              >
              </w-file-upload>
            </a-form-model-item>
          </a-col>
        </a-row>
        <a-row>
          <a-col :span="12">
            <a-form-model-item
              label="供应商是产品的生产厂商还是贸易商?"
              :label-col="{ span: 24 }"
              :wrapper-col="{ span: 24 }"
              prop="isTrader"
            >
              <a-radio-group v-model="formInfo.isTrader">
                <a-radio key="1" value="1" class="radio-item">是</a-radio>
                <a-radio key="0" value="0" class="radio-item">否</a-radio>
              </a-radio-group>
            </a-form-model-item>
          </a-col>
          <a-col :span="12">
            <a-form-model-item
              label="制造商授权证书"
              prop="certificateAuthorizationFile"
              :label-col="{ span: 24 }"
              :wrapper-col="{ span: 24 }"
              style="margin-left: 10px"
            >
              <w-file-upload
                class="avatar-uploader"
                text="上传"
                :pdfOnly="true"
                :multipleFlag="true"
                v-model="formInfo.certificateAuthorizationFile"
                bizPath="annexUrl"
              >
              </w-file-upload>
            </a-form-model-item>
          </a-col>
        </a-row>
        <a-divider orientation="left">配置清单</a-divider>
        <div style="font-size: 13px">
          按照合同配置清单中此类设备的配置清单进行填写
        </div>
        <a-table
          :columns="contractEquipmentConfigurationColumns"
          :dataSource="contractEquipmentConfigurationList"
          :pagination="false"
          bordered
          size="middle"
          rowKey="key"
        >
          <!-- 自定义单元格渲染 - 可编辑单元格 v-for="(row, index) in data" -->
          <template
            v-for="col in editableContractEquipmentConfigurationColumns"
            :slot="col.dataIndex"
            slot-scope="text, record, index"
          >
            <div :key="col.dataIndex" class="editable-cell">
              <span v-if="col.dataIndex == 'index'">{{ text }} </span>

              <a-input
                type="textarea"
                v-else-if="col.dataIndex == 'remark'"
                v-model="record[col.dataIndex]"
                @blur="
                  validateContractEquipmentConfigurationField(
                    record,
                    col.dataIndex
                  )
                "
                :class="{
                  'error-field': record.errors && record.errors[col.dataIndex],
                }"
              />

              <a-input
                v-else
                v-model="record[col.dataIndex]"
                @blur="
                  validateContractEquipmentConfigurationField(
                    record,
                    col.dataIndex
                  )
                "
                :class="{
                  'error-field': record.errors && record.errors[col.dataIndex],
                }"
              />

              <div
                class="error-message"
                v-if="record.errors && record.errors[col.dataIndex]"
              >
                {{ record.errors[col.dataIndex] }}
              </div>
            </div>
          </template>

          <!-- 操作列 - 添加/删除行按钮 -->
          <template slot="action" slot-scope="text, record, index">
            <div class="action-buttons">
              <a-tooltip title="添加一行">
                <a-button
                  type="primary"
                  shape="circle"
                  icon="plus"
                  size="small"
                  @click="addContractEquipmentConfigurationRow(index)"
                  v-if="index === contractEquipmentConfigurationList.length - 1"
                  :disabled="hasContractEquipmentConfigurationErrors"
                />
              </a-tooltip>
              <a-tooltip title="删除此行" v-if="index != 0">
                <!-- {{ index == contractPartyList.length - 1 }} -->
                <a-button
                  style="background-color: #d9d9d9"
                  type="default"
                  shape="circle"
                  icon="minus"
                  size="small"
                  @click="removeContractEquipmentConfigurationRow(index)"
                  v-if="index === contractEquipmentConfigurationList.length - 1"
                />
              </a-tooltip>
            </div>
          </template>

          <!-- 表头添加必填标识 -->
          <template slot="institutionNameTitle" slot-scope="title">
            <span class="required-label">*</span>{{ title }}
          </template>
        </a-table>
        <a-divider orientation="left">配置参数</a-divider>
        <a-row>
          <a-col :span="10">
            <a-form-model-item
              label="附件"
              prop="configurationParameter"
              :label-col="{ span: 24 }"
              :wrapper-col="{ span: 24 }"
            >
              <w-file-upload
                class="avatar-uploader"
                text="上传"
                :pdfOnly="true"
                :multipleFlag="true"
                v-model="formInfo.configurationParameter"
                bizPath="annexUrl"
              >
              </w-file-upload>
            </a-form-model-item>
          </a-col>
        </a-row>
        <a-divider orientation="left">常见故障</a-divider>
        <div style="font-size: 13px">常见故障现象</div>
        <a-table
          :columns="contractEquipmentCommonFaultColumns"
          :dataSource="contractEquipmentCommonFaultList"
          :pagination="false"
          bordered
          size="middle"
          rowKey="key"
        >
          <!-- 自定义单元格渲染 - 可编辑单元格 v-for="(row, index) in data" -->
          <template
            v-for="col in editableContractEquipmentCommonFaultColumns"
            :slot="col.dataIndex"
            slot-scope="text, record, index"
          >
            <div :key="col.dataIndex" class="editable-cell">
              <span v-if="col.dataIndex == 'index'">{{ text }} </span>

              <a-input
                type="textarea"
                v-else-if="col.dataIndex == 'investigationPlan'"
                v-model="record[col.dataIndex]"
                @blur="
                  validateContractEquipmentCommonFaultField(
                    record,
                    col.dataIndex
                  )
                "
                :class="{
                  'error-field': record.errors && record.errors[col.dataIndex],
                }"
              />

              <a-input
                v-else
                v-model="record[col.dataIndex]"
                @blur="
                  validateContractEquipmentCommonFaultField(
                    record,
                    col.dataIndex
                  )
                "
                :class="{
                  'error-field': record.errors && record.errors[col.dataIndex],
                }"
              />

              <div
                class="error-message"
                v-if="record.errors && record.errors[col.dataIndex]"
              >
                {{ record.errors[col.dataIndex] }}
              </div>
            </div>
          </template>

          <!-- 操作列 - 添加/删除行按钮 -->
          <template slot="action" slot-scope="text, record, index">
            <div class="action-buttons">
              <a-tooltip title="添加一行">
                <a-button
                  type="primary"
                  shape="circle"
                  icon="plus"
                  size="small"
                  @click="addContractEquipmentCommonFaultRow(index)"
                  v-if="index === contractEquipmentCommonFaultList.length - 1"
                  :disabled="hasContractEquipmentCommonFaultErrors"
                />
              </a-tooltip>
              <a-tooltip title="删除此行" v-if="index != 0">
                <!-- {{ index == contractPartyList.length - 1 }} -->
                <a-button
                  style="background-color: #d9d9d9"
                  type="default"
                  shape="circle"
                  icon="minus"
                  size="small"
                  @click="removeContractEquipmentCommonFaultRow(index)"
                  v-if="index === contractEquipmentCommonFaultList.length - 1"
                />
              </a-tooltip>
            </div>
          </template>

          <!-- 表头添加必填标识 -->
          <template slot="institutionNameTitle" slot-scope="title">
            <span class="required-label">*</span>{{ title }}
          </template>
        </a-table>

        <a-divider orientation="left">质控保养</a-divider>
        <a-row>
          <a-col :span="12">
            <a-form-model-item
              label="日常检查模板"
              prop="dailyInspectionTemplateFile"
            >
              <w-file-upload
                class="avatar-uploader"
                text="上传"
                :pdfOnly="true"
                :multipleFlag="true"
                v-model="formInfo.dailyInspectionTemplateFile"
                bizPath="annexUrl"
              >
              </w-file-upload>
            </a-form-model-item>
          </a-col>
          <a-col :span="12">
            <a-form-model-item label="巡检模板" prop="inspectionTemplateFile">
              <w-file-upload
                class="avatar-uploader"
                text="上传"
                :pdfOnly="true"
                :multipleFlag="true"
                v-model="formInfo.inspectionTemplateFile"
                bizPath="annexUrl"
              >
              </w-file-upload>
            </a-form-model-item>
          </a-col>
        </a-row>
        <a-row>
          <a-col :span="12">
            <a-form-model-item label="预防性维护模板" prop="maintainTemplate">
              <w-file-upload
                class="avatar-uploader"
                text="上传"
                :pdfOnly="true"
                :multipleFlag="true"
                v-model="formInfo.maintainTemplate"
                bizPath="annexUrl"
              >
              </w-file-upload>
            </a-form-model-item>
          </a-col>
          <a-col :span="12">
            <a-form-model-item label="专业检测模板" prop="detectionTemplate">
              <w-file-upload
                class="avatar-uploader"
                text="上传"
                :pdfOnly="true"
                :multipleFlag="true"
                v-model="formInfo.detectionTemplate"
                bizPath="annexUrl"
              >
              </w-file-upload>
            </a-form-model-item>
          </a-col>
        </a-row>
        <a-divider orientation="left">售后服务</a-divider>

        <a-row>
          <a-col :span="11">
            <a-form-model-item
              label="售后服务机构"
              prop="serviceOrganization"
              :label-col="{ span: 24 }"
              :wrapper-col="{ span: 24 }"
            >
              <a-input
                v-model="formInfo.serviceOrganization"
                placeholder="请输入售后服务机构"
              />
            </a-form-model-item>
          </a-col>
          <a-col :span="11" offset="2">
            <a-form-model-item
              label="过保修期后年度保修费用(单位:元/年/台设备)"
              prop="warrantyCost"
              :label-col="{ span: 24 }"
              :wrapper-col="{ span: 24 }"
            >
              <a-input
                v-model="formInfo.warrantyCost"
                placeholder="请输入过保修期后年度保修费用(单位:元/年/台设备)"
              />
            </a-form-model-item>
          </a-col>
        </a-row>
        <a-row style="margin-top: 15px">
          <a-col :span="11">
            <a-form-model-item
              label="售后电话"
              prop="afterSalesPhone"
              :label-col="{ span: 24 }"
              :wrapper-col="{ span: 24 }"
            >
              <a-input
                v-model="formInfo.afterSalesPhone"
                placeholder="请输入售后电话"
              />
            </a-form-model-item>
          </a-col>
          <a-col :span="11" offset="2">
            <a-form-model-item
              label="工程师联系人姓名"
              prop="contactName"
              :label-col="{ span: 24 }"
              :wrapper-col="{ span: 24 }"
            >
              <a-input
                style="width: 150px"
                v-model="formInfo.contactName"
                placeholder="请输入联系人姓名"
              />
              <a-input
                style="width: 281px"
                v-model="formInfo.contactPhone"
                placeholder="请输入联系人手机号"
              />
            </a-form-model-item>
          </a-col>
        </a-row>
        <div style="height: 60px"></div>
      </a-form-model>
    </a-spin>
    <div class="drawer-bootom-button" style="margin-bottom: 20px">
      <a-popconfirm
        title="确定放弃编辑？"
        @confirm="handleCancel"
        okText="确定"
        cancelText="取消"
      >
        <a-button style="margin-right: 0.8rem">取消</a-button>
      </a-popconfirm>
      <a-button @click="handleSubmit" type="primary" :loading="confirmLoading"
        >提交</a-button
      >
    </div>
  </a-drawer>
</template>

<script>
import { getAction, postAction } from '@/api/manage'
import WImageUpload from '@/components/WxImageUpload/WImageUpload'
import WFileUpload from '@/components/WxFileUpload/WFileUpload'
export default {
  name: 'DevContractEquipmentEdit',
  components: {
    WImageUpload,
    WFileUpload,
  },
  data() {
    return {
      visible: false,
      confirmLoading: false,
      formInfo: {
        createTime: undefined,
        contractId: undefined,
        equipmentName: undefined,
        genericName: undefined,
        brand: undefined,
        model: undefined,
        manufacturer: undefined,
        serviceLife: undefined,
        differentCountrie: undefined,
        isDomesticallyProduced: undefined,
        productAppearanceImage: undefined,
        isTrader: undefined,
        certificateAuthorizationFile: undefined,
        isMedicalDevice: false,
        medicalDeviceRegistrationNumber: undefined,
        medicalDeviceRegistrationFile: undefined,
        configurationParameter: undefined,
        dailyInspectionTemplateFile: undefined,
        inspectionTemplateFile: undefined,
        maintainTemplate: undefined,
        detectionTemplate: undefined,
        serviceOrganization: undefined,
        warrantyCost: undefined,
        afterSalesPhone: undefined,
        contactName: undefined,
        contactPhone: undefined,
        equipmentTotalAmount: 0.0,
        equipmentUnitPrice: 0.0,
        deviceNumber: 0,
        warrantyPeriod: 0,
        contractEquipmentConfiguration: undefined,
        contractEquipmentCommonFault: undefined,
        wx: '',
      },
      drawerWidth: 800,
      url: {
        saveInfo: '/system/devContractEquipment/save',
        getInfo: '/system/devContractEquipment/info',
      },
      contractEquipmentConfigurationColumns: [
        {
          title: '序号',
          dataIndex: 'index',
          width: 80,
          scopedSlots: {
            customRender: 'index',
          },
        },
        {
          title: '配件名称',
          dataIndex: 'accessoryName',
          width: 120,
          scopedSlots: {
            customRender: 'accessoryName',
          },
        },
        {
          title: '规格型号',
          dataIndex: 'specificationModel',
          scopedSlots: {
            customRender: 'specificationModel',
          },
        },
        {
          title: '建议更换周期(月)',
          dataIndex: 'suggestedReplacementCycle',
          scopedSlots: { customRender: 'suggestedReplacementCycle' },
        },
        {
          title: '备注',
          dataIndex: 'remark',
          scopedSlots: { customRender: 'remark' },
        },
        {
          title: '操作',
          dataIndex: 'action',
          width: '10%',
          scopedSlots: { customRender: 'action' },
        },
      ],
      contractEquipmentConfigurationList: [
        {
          key: Date.now().toString(),
          index: 1,
          contractEquipmentId: undefined,
          accessoryName: undefined,
          specificationModel: undefined,
          suggestedReplacementCycle: undefined,
          remark: undefined,
          contractId: undefined,
          errors: {},
        },
      ],
      contractEquipmentCommonFaultColumns: [
        {
          title: '序号',
          dataIndex: 'index',
          width: 80,
          scopedSlots: {
            customRender: 'index',
          },
        },
        {
          title: '故障现象',
          dataIndex: 'phenomenon',
          width: 120,
          scopedSlots: {
            customRender: 'phenomenon',
          },
        },
        {
          title: '自助故障排查方案',
          dataIndex: 'investigationPlan',
          scopedSlots: {
            customRender: 'investigationPlan',
          },
        },
        {
          title: '操作',
          dataIndex: 'action',
          width: '10%',
          scopedSlots: { customRender: 'action' },
        },
      ],
      contractEquipmentCommonFaultList: [
        {
          key: Date.now().toString(),
          index: 1,
          contractEquipmentId: undefined,
          contractId: undefined,
          phenomenon: undefined,
          investigationPlan: undefined,
          errors: {},
        },
      ],
      formInfoCopy: {},
    }
  },
  computed: {
    editableContractEquipmentCommonFaultColumns() {
      return this.contractEquipmentCommonFaultColumns.filter(
        (col) => col.dataIndex !== 'action'
      )
    },
    // 检查是否有错误
    hasContractEquipmentCommonFaultErrors() {
      return this.contractEquipmentCommonFaultList.some(
        (row) => row.errors && Object.keys(row.errors).length > 0
      )
    },

    editableContractEquipmentConfigurationColumns() {
      return this.contractEquipmentConfigurationColumns.filter(
        (col) => col.dataIndex !== 'action'
      )
    },
    // 检查是否有错误
    hasContractEquipmentConfigurationErrors() {
      return this.contractEquipmentConfigurationList.some(
        (row) => row.errors && Object.keys(row.errors).length > 0
      )
    },
  },
  created() {},
  methods: {
    // START 常见故障
    // 添加新行
    addContractEquipmentCommonFaultRow(index) {
      if (this.hasContractEquipmentCommonFaultErrors) return
      var indexOf = index + 1
      this.contractEquipmentCommonFaultList.splice(indexOf, 0, {
        key: Date.now().toString(),
        index: indexOf + 1,
        contractEquipmentId: undefined,
        contractId: undefined,
        phenomenon: undefined,
        investigationPlan: undefined,
        errors: {},
      })
    },

    // 删除行
    removeContractEquipmentCommonFaultRow(index) {
      this.contractEquipmentCommonFaultList.splice(index, 1)
    },

    // 验证字段
    validateContractEquipmentCommonFaultField(record, field) {
      // 清除旧错误
      if (record.errors && record.errors[field]) {
        this.$delete(record.errors, field)
      }

      // 必填校验规则
      const requiredFields = ['institutionName']
      if (requiredFields.includes(field) && !record[field]) {
        this.$set(
          record.errors,
          field,
          `${this.getContractEquipmentCommonFaultTitle(field)}不能为空`
        )
      }
    },

    // 获取字段标题
    getContractEquipmentCommonFaultTitle(field) {
      const column = this.contractEquipmentCommonFaultColumns.find(
        (col) => col.dataIndex === field
      )
      return column ? column.title : field
    },

    // END常见故障

    // START 配置清单
    // 添加新行
    addContractEquipmentConfigurationRow(index) {
      if (this.hasContractEquipmentConfigurationErrors) return
      var indexOf = index + 1
      this.contractEquipmentConfigurationList.splice(indexOf, 0, {
        key: Date.now().toString(),
        index: indexOf + 1,
        contractEquipmentId: undefined,
        accessoryName: undefined,
        specificationModel: undefined,
        suggestedReplacementCycle: undefined,
        remark: undefined,
        contractId: undefined,
        errors: {},
      })
    },

    // 删除行
    removeContractEquipmentConfigurationRow(index) {
      this.contractEquipmentConfigurationList.splice(index, 1)
    },

    // 验证字段
    validateContractEquipmentConfigurationField(record, field) {
      // 清除旧错误
      if (record.errors && record.errors[field]) {
        this.$delete(record.errors, field)
      }

      // 必填校验规则
      const requiredFields = ['institutionName']
      if (requiredFields.includes(field) && !record[field]) {
        this.$set(
          record.errors,
          field,
          `${this.getContractEquipmentConfigurationTitle(field)}不能为空`
        )
      }
    },

    // 获取字段标题
    getContractEquipmentConfigurationTitle(field) {
      const column = this.contractEquipmentConfigurationColumns.find(
        (col) => col.dataIndex === field
      )
      return column ? column.title : field
    },

    // END配置清单

    add() {
      this.edit()
    },
    edit(record) {
      console.log('我是设备编辑页面>>>>', record)
      this.formInfo = record
      this.formInfoCopy = record
      //设备清单
      var contractEquipmentConfiguration =
        this.formInfo.contractEquipmentConfiguration
      if (contractEquipmentConfiguration) {
        this.contractEquipmentConfigurationList = JSON.parse(
          contractEquipmentConfiguration
        )
      } else {
        this.contractEquipmentConfigurationList = [
          {
            key: Date.now().toString(),
            index: 1,
            contractEquipmentId: undefined,
            accessoryName: undefined,
            specificationModel: undefined,
            suggestedReplacementCycle: undefined,
            remark: undefined,
            contractId: undefined,
            errors: {},
          },
        ]
      }

      //常见故障
      var contractEquipmentCommonFault =
        this.formInfo.contractEquipmentCommonFault
      if (contractEquipmentCommonFault) {
        this.contractEquipmentCommonFaultList = JSON.parse(
          contractEquipmentCommonFault
        )
      } else {
        this.contractEquipmentCommonFaultList = [
          {
            key: Date.now().toString(),
            index: 1,
            contractEquipmentId: undefined,
            contractId: undefined,
            phenomenon: undefined,
            investigationPlan: undefined,
            errors: {},
          },
        ]
      }

      this.visible = true
    },
    // 确定
    handleSubmit() {
      // 触发表单验证
      //this.confirmLoading = true

      //设备清单
      var contractEquipmentConfigurationList =
        this.contractEquipmentConfigurationList
      if (contractEquipmentConfigurationList) {
        this.formInfo.contractEquipmentConfiguration = JSON.stringify(
          contractEquipmentConfigurationList
        )
      }

      //常见故障
      var contractEquipmentCommonFaultList =
        this.contractEquipmentCommonFaultList
      if (contractEquipmentCommonFaultList) {
        this.formInfo.contractEquipmentCommonFault = JSON.stringify(
          contractEquipmentCommonFaultList
        )
      }

      this.$refs.ruleForm.validate((valid) => {
        if (valid) {
          this.$message.success('保存成功')
          this.$emit('ok', this.formInfo)
          this.visible = false
        } else {
          //this.confirmLoading = false
        }
      })
    },
    // 关闭
    handleCancel() {
      this.close()
    },
    close() {
      this.$refs.ruleForm.resetFields()
      this.formInfo = this.formInfoCopy
      this.$emit('close', this.formInfo)
      this.visible = false
    },
    editorOk(val) {
      this.formInfo.content = val
    },
  },
}
</script>
